<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
        <link rel="stylesheet" href="../static/libs/sweetalert/sweetalert.css">
        <link rel="stylesheet" href="../static/libs/layui/layui.css">
        <link rel="stylesheet" href="../static/libs/awesome/css/font-awesome.min.css">
        <link rel="stylesheet" href="../static/libs/prism/prism-dark.css">
        <link rel="stylesheet" href="../static/css/common.css">
        <style>
            html,body { margin :0px; padding :0px; width: 100%; height: 100%; position: relative;}
            #bar { position: absolute; height: 100%; width: 350px; background:#fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);}
            #bar .logo { text-align: center; line-height: 100px; height: 100px;} 
            #Menu { position: absolute; width: 280px; top: 100px; bottom: 0px; overflow-y: auto; padding: 0 25px 100px 45px;}
            #Menu .MenuItem span { color:royalblue; cursor: pointer; line-height: 45px; }
            #Menu .MenuItem i { margin: 0 5px 0 -20px; display: none;}
            #Menu .MenuItem span:hover { border-bottom: 1px solid royalblue ;}
            #Menu .MenuItem span.active i {display: inline-block;}
            #Menu .children { padding: 0 0 0 20px;}
            #Menu .menuTag { margin-left: -20px; margin-top: 30px; margin-bottom: 10px; color : #999; font-size: 14px;}

            ::-webkit-input-placeholder{color: #ccc}
            ::-webkit-scrollbar-track-piece {background-color:#fff; border-radius:0 }
            ::-webkit-scrollbar { width:10px; height:10px }
            ::-webkit-scrollbar-thumb { height:50px; background-color:#ddd; border-radius:6px; outline:2px solid #fff; outline-offset:-2px; border:2px solid #fff; filter:alpha(opacity=50); opacity:0.5}
            ::-webkit-scrollbar-thumb:hover { height:50px; background-color:#878987; border-radius:6px}
            #content {position: fixed; top: 0px; right: 0px; bottom: 0; left: 350px; overflow-y: auto; }

            #content .page { padding : 40px}
            #content .line { height: 1px; border-bottom: 1px solid #dedede; margin : 20px 0;} 
            #content a { font-size: 22px; color: royalblue;}
        </style>
    </head>

    <body>
        <div id="bar">
            <div class="logo">
                <h2>ICloudMapUI For Layui</h2>
            </div>
        </div>
        <div id="content"></div>
        <script src="../static/libs/jquery/jquery.js"></script>
        <script src="../static/libs/jquery/jquery.form.js"></script>
        <script src="../static/libs/jquery/jquery.mousewheel.js"></script>
        <script src="../static/libs/sweetalert/sweetalert.min.js"></script>
        <script src="../static/libs/layui/layui.all.js"></script>
        <script src="../static/libs/prism/prism-dark.js"></script>
        <script src="../static/libs/ckeditor/ckeditor.js"></script>

        <!-- <% if (process.env === 'production') { %> -->
        <!-- <% } %> -->
        <script src="../static/IcloudmapUI.forLayui.js"></script>



    </body>

</html>